<template>
    <view class="content">
        <view class="info-box">
            <view class="item column">
                <text class="label">姓名</text>
                <text class="text">{{item.name}}</text>
            </view>
            <view class="item column">
                <text class="label">手机号</text>
                <text class="text" @click="callPhone(item.mobile)">{{item.mobile}}</text>
            </view>
            <view class="item column">
                <text class="label">电话</text>
                <text class="text">{{item.telephone}}</text>
            </view>
            <view class="item column">
                <text class="label">邮箱</text>
                <text class="text">{{item.email}}</text>
            </view>
            <view class="item column">
                <text class="label">部门</text>
                <text class="text">{{item.dept}}</text>
            </view>
            <view class="item column">
                <text class="label">职务</text>
                <text class="text">{{item.post}}</text>
            </view>
            <view class="item column">
                <text class="label">地址</text>
                <text class="text">{{item.address}}</text>
            </view>
            <view class="item column">
                <text class="label">备注</text>
                <text class="text">{{item.remark}}</text>
            </view>
        </view>

    </view>
</template>

<script>
    export default {
        data() {
            return {
                item: {}
            }
        },
        onLoad(options) {
            // 修改顶部导航背景色
            uni.setNavigationBarColor({
                frontColor: '#ffffff',
                backgroundColor: '#39b54a',
                animation: {
                    duration: 400,
                    timingFunc: 'easeIn'
                }
            })
            console.log(JSON.parse(decodeURIComponent(options.item)));
            this.item = JSON.parse(decodeURIComponent(options.item));
        },
        methods: {
            callPhone(tel) {
                uni.makePhoneCall({
                    phoneNumber: tel
                })
            },
        }
    }
</script>

<style scoped lang="scss">
    .content {
        background: #fff;
        padding-bottom: 20upx;

        .info-box {
            .item {
                height: 90upx;
                line-height: 90upx;
                padding: 0 50upx;
                border-bottom: 1px solid #f7f7f7;

                &:last-child {
                    border-bottom: none;
                }

                &.column {
                    height: auto;
                    display: flex;
                    flex-direction: column;

                    .text {
                        margin-bottom: 20upx;
                        line-height: 1.5;
                    }
                }

                .label {
                    font-size: 30upx;
                    color: #999;
                    margin-right: 30upx;
                }

                .text {
                    font-size: 32upx;
                    color: #000;

                    &.blue {
                        color: #2172FF;
                    }
                }
            }
        }
    }
</style>